<div class="highlights-container">
    <div class="video-body">
        <video id="video" controls style="width:100%" poster="{{posterURL(cur_video)}}">
            <source ng-src="{{videoURL(cur_video)}}" type='video/mp4;codecs="avc1.42E01E, mp4a.40.2"'/>
        </video>
        <span class="video-header">{{cur_video.title}} <span class="label label-primary">{{cur_video.topic}}</span></span>
        <div class="video-feedback">
            <button ng-if="unrated(cur_video, true)" type="button" class="btn btn-success" ng-click="video_feedback(cur_video, true)">
                <span class="glyphicon glyphicon-thumbs-up"></span> Like</button>
            <button ng-if="unrated(cur_video, true)" type="button" class="btn btn-danger" ng-click="video_feedback(cur_video, false)">
                <span class="glyphicon glyphicon-thumbs-down"></span> Dislike</button>
            <span ng-if="liked(cur_video, true)" class="label label-success video-label">
                <span class="glyphicon glyphicon-thumbs-up"></span> You liked this!</span>
            <span ng-if="disliked(cur_video, true)" class="label label-danger video-label">
                <span class="glyphicon glyphicon-thumbs-down"></span> You disliked this!</span>
        </div>
        <div class="video-summary">
            {{cur_video.summary}}
        </div>
        <div class="video-summary">
            <span>Annotated with:</span>
            <span ng-repeat="va in cur_video_annotations track by $index" ng-class="getLabelType(va[1])">
                {{va[0].name}}
            </span>
        </div>
    </div>
</div>